<template>
	<div id="msg">
		<div id="nav-bar" >
			<nav-bar>
				<div slot="left">
					<div id="logo" style="width: 60px;">
						<img src="../../../public/jesus.png" style="width:100%"/>
					</div>
				</div>
				<div slot="center" class="center">
					<el-input
						id="search"
						style="margin-right: 15px"
					    placeholder="请输入内容"
					    v-model="lookfor"
						@keyup.enter.native="toSearch"
						  />
					  </el-input>
				</div>
				<div slot="right" class="right">
					<div>
						<el-button type="primary"
						class="video"
						@click.native = "publishVideo()"
								>发布视频
						</el-button>
					</div>
					<!-- <div v-for="(item,index) in route" @click="toPage(item)" :key="index">
						<span>{{txt[index]}}</span>
					</div> -->
					<avatar v-show="this.common.isLogin" class="avatar"
							@click.native="toPage('/profile')"></avatar>
					<div id="login" @click="toPage('/login')" v-if="!this.common.isLogin">
						<span>登录</span>
					</div>
					<div id="register" @click="toPage('/register')" v-if="!this.common.isLogin">
						<span>注册</span>
					</div>
					
				</div>
			</nav-bar>
		</div>
		<show-videos :list="videolist"></show-videos>
	</div>
</template>

<script>
	import ShowVideos from 'components/content/ShowVideos'
	import {downlowdVideos} from 'network/videos.js'
	import NavBar from 'components/common/NavBar.vue'
	import avatar from 'components/common/avatar.vue'
	import {DownloadVideo} from 'network/download.js'
	
	export default{
		name:"Msg",

		data(){
			return {
				videolist:[],
				urls:[],
				lookfor:'',
				data:[],
				page: 1,
				plength:0,
				route:['/home','/category','/msg'],
				txt:['主页','分类','消息']
			}
			
		},
		methods:{
			publishVideo(){
				if(this.common.isLogin==true)
					return this.$router.push('/bigfile')
				alert('您尚未登录！');
				},
			toPage(value){
				this.$router.push(value)
			},
			
		},
		components:{
			ShowVideos
			,NavBar,
			avatar
			},
		created(){
			// downlowdVideos().then(res=>{
			// 	this.urls = res.data,
			// 	console.log(res)
			// }),
			DownloadVideo().then(res=>{
				this.videolist = res.data
			})
		}
	}
</script>

<style scoped="scoped">
	#nav-bar{
		/* box-sizing: border-box; */
		display: flex;
		height: 80px;
		background-color: white;
		border-bottom: 1px solid #f1f1f1;
		/* box-shadow:-10px -10px 15px; */
		padding-top: 5px;
		margin-bottom: 25px;
	}
	.center{
		position: relative;
		padding: 6px;
		padding-top: 10px;
		width: 388px;
	}
	.right{
		display: flex;
		cursor: pointer;
	}
	.right>div{
		color:black;
		flex:1;
		line-height: 60px;
	}
	.avatar{
		padding-top: 10px;
	}
	.video{
		margin-top: 15px;
		margin-right:15px;
		height: 35px;
	}
</style>
